.WriteArticle {
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  background: white;
  overflow: auto;

  .Header {
    position: absolute;
    top: 0;
    width: 100%;
    height: 60px;
    display: flex;
    justify-content: center;

    .Content {
      width: 100%;
      z-index: 999;
      background-color: white;
      height: 61px;
      display: flex;
      justify-content: center;
      .Info{
        width: 60%;
        display: flex;
        justify-content: space-between;
        align-items: center;
      }

      Button  {
        margin: 0 10px;
      }
    }

  }

  .ReactQuill {
    top: 60px;
    border-radius: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    :global {
      .ql-toolbar.ql-snow {
        //position: absolute;
        display: flex;
        justify-content: center;
        width: 100%;
        font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
        background-color: #fff;
        border-bottom: 1px solid #f7f7f7;
        border-top: unset;
        padding-bottom: 18px;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        z-index: 50;

        button {
          margin: 0 14px;
        }

        svg {
          width: 26px;
          height: 26px;
        }
      }

      .ql-container.ql-snow {
        background-color: white;
        font-size: 16px;
        width: 960px;
        position: relative;
        padding-top: 30px;
        padding-bottom: 50vh;
        outline: none;
        border: unset;
      }
    }
  }
}

.PublishContainer {
  width: 440px;
  display: flex;
  flex-direction: column;

  :global {
    :where(.css-dev-only-do-not-override-acm2ia).ant-divider-horizontal {
      margin: 24px 0;
    }
  }
}